﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<title>02 Dialog: JQueryUi Test</title>
	<!-- -->
	<style type="text/css">
		body, html {
			width: 100%;
			height: 100%;
			margin: 0;
			overflow: hidden;
			font-family: "Segoe UI", Arial, Verdana;
			font-size: 9pt;
			background-color: #F1F1F1;
		}
	</style>
	<script src="../../../bootloader.js" type="text/javascript"></script>
	<!-- -->
	<script type="text/javascript">
		go = function() {
			view = new opus.View({
				w: "100%", h: "100%", styles: {border: 1, padding: 8, borderColor: "green"},
				controls: [
					{w: "100%", h: 30, controls: [
						{type: "Button", caption: "Open", w: 100, h: 30, clickHandler: function() {
							view.$.widget.open();
						}},
						{type: "Button", caption: "Close", l: 116, w: 100, h: 30, clickHandler: function() {
							view.$.widget.close();
						}}
					]},
					{w: "100%", t: 40, h: 30, controls: [
						{type: "Button", caption: "Open 2", w: 100, h: 30, clickHandler: function() {
							view.$.widget2.open();
						}},
						{type: "Button", caption: "Close 2", l: 116, w: 100, h: 30, clickHandler: function() {
							view.$.widget2.close();
						}}
					]},
					{name: "widget", type: "opus.jqueryui.Dialog", caption: "Dialog: DOM content", content: "<div>Hi, I'm inside a dialog!</div>"},
					{name: "widget2", type: "opus.jqueryui.Dialog", caption: "Dialog: Controls content", controls: [
						{content: "Hello World", height: "100%", width: "100%"}
					]}
				]
			});
		}
	</script>
</head>
<body onload="go()">
	<!--<div id="test">
		Hi, I'm inside a dialog!
	</div>-->
</body>
</html>
